<template>
	<view class="content">
		<view class="section-0">
			<view class="section-body">
				<view class="list">
					<view :class="`item ${item.disabled ? 'item__disabled' : ''}`" @click="go(item.path)" v-for="item in list" :key="item.id">
						<view class="left">
							<view class="name">{{ item.name }}</view>
						</view>
						<view class="right">
							<text class="iconfont icon-xiangyou1"></text>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			list: [
				{ id: 1, name: '财务预算', path: '/pages/work/manager/construction/manufacturing/finance/index' },
				{
					id: 2,
					name: '服务合同支付',
					path: '/pages/work/manager/construction/manufacturing/capital/index',
				},
				{
					id: 5,
					name: '结算典型经验',
					path: '/pages/statistics/manufacture/settlement/index',
				},
				{
					id: 3,
					name: '技经管控卡',
					path: '/pages/statistics/manufacture/Technical/Technical',
				},
				// {
				// 	id: 3,
				// 	name: '变更与签证',
				// 	// path: '/pages/work/manager/construction/manufacturing/visa/index',
				// 	disabled: true
				// },
				// {
				// 	id: 4,
				// 	name: '结算审计',
				// 	// path: '/pages/work/manager/construction/manufacturing/settlement/index',
				// 	disabled: true
				// }
			]
		}
	},
	methods: {
		go(path) {
			uni.navigateTo({
				url: path
			})
		}
	}
}
</script>

<style lang="scss" scoped>
.content {
	.section-0 {
		width: 100%;
		background-color: #3a5df5;
		.section-body {
			padding-top: 38rpx;
			box-sizing: border-box;
			width: 100%;
			padding-left: 40rpx;
			padding-right: 40rpx;
			padding-bottom: 50rpx;
			height: 300rpx;
			background-color: #fff;
			background-size: cover;
			background-repeat: no-repeat;
			border-top-left-radius: 50rpx;
			border-top-right-radius: 50rpx;
			.list {
				width: 100%;
				.item {
					width: 100%;
					height: 100rpx;
					background-color: #ffffff;
					border-radius: 35rpx;
					box-shadow: 0 0 20rpx 10rpx rgba(#bcbcb5, 0.17);
					box-sizing: border-box;
					padding: 30rpx;
					@include clear();
					margin-bottom: 28rpx;
					.left {
						float: left;
						width: 520rpx;
						.name {
							height: 40rpx;
							width: 100%;
							font-size: 26rpx;
							font-weight: bold;
							font-stretch: normal;
							line-height: 40rpx;
							letter-spacing: 0rpx;
							color: #46464a;
						}
					}
					.right {
						width: 20rpx;
						float: right;
						height: 40rpx;
						line-height: 40rpx;
						color: #3b3c40;
						.iconfont {
							font-size: 32rpx;
						}
					}
				}
				.item__disabled {
					.left {
						opacity: 0.25;
					}
					.right {
						opacity: 0.25;
					}
				}
			}
		}
	}
}
</style>
